import React from 'react';
import {connect} from 'dva';
import PropTypes from 'prop-types';
import {Link} from 'dva/router'
import {Table, Button,Row,Col,Icon,Layout, Breadcrumb,Input,DatePicker,Dropdown,Popconfirm, message} from 'antd';
// import SelectPageTable from '../../components/SelectPageTable.js';
import style from '../../styles/TableCss.less';
import reqwest from 'reqwest';
// import {PublicCustomer} from '../utils/PublicCode.js'
// import TopUpBoxAmt from './components/TopUpBpxAmt.js'
// console.log(PublicCustomer)
const {  Content, Footer ,Sider} = Layout;
// const { RangePicker } = DatePicker;
let _status;
function onChange(value, dateString) {
  console.log('Selected Time: ', value);
  console.log('Formatted Selected Time: ', dateString);
}
function onOk(value) {
  console.log('onOk: ', value);
}
class Company extends React.Component{
	constructor(props){
		super(props);
		let _this = this;
		this.state={
			data: [],
		    pagination: {},
		    loading: false,
	      selectedRowKeys: [],
	      dropDown:'所有客户',
				_columns :[{
				  title: '品牌',
				  dataIndex: 'name',
				  width: '20%',
				}, {
				  title: '管理员',
				  dataIndex: 'admin',
				  width: '20%',
				}, {
				  title: '手机号',
				  dataIndex: 'mobile',
				}, {
				  title: '状态',
				  dataIndex: 'status',
				}],
				delalet:[{
				  title: '经销商',
				  dataIndex: 'name',
				  width: '20%',
				}, {
				  title: '联系人',
				  dataIndex: 'admin',
				  width: '20%',
				}, {
				  title: '手机号',
				  dataIndex: 'mobile',
				}, {
				  title: '状态',
				  dataIndex: 'status',
				
				}]
		}
	}
		// <Popconfirm title="确认删除吗?" onConfirm={(e) => this.onDelete(record.key, e,this)}>
				      // <span className="ant-divider" />
				     		// <a>删除</a>
		// 		     	</Popconfirm>
	updata(text, record,state,b,c){
		console.log(state)
		let _this = this;
		reqwest({
      url: window.host+'/api/accounts/update_me',
      method: 'PATCH',
      crossOrigin: true,
      data: {
        access_token:localStorage['token'],
        apply_id:record.key,
        state:state
      },
      type: 'json',
    }).then((data) => {
      if(data.status=='success'){
				message.success('更新成功',1,()=>{
					window.location.hash='/app/accounts?current=1';
				})
			}else{
				message.warning(data.msg,1)
			}
    }).fail((err)=>{
			console.log(2)
		})
	}
	onDelete(key,e,_this){
    const data = _this.state.data.filter(item => item.key !== key);
    _this.setState({data });
  }
	handleTableChange(pagination, filters, sorter){
    const pager = { ...this.state.pagination };
    // console.log(pagination.current)
    pager.current = pagination.current;
    this.setState({
      pagination: pager,
    });
    this.fetch({
      results: pagination.pageSize,
      page: pagination.current,
      sortField: sorter.field,
      sortOrder: sorter.order,
      ...filters,
    });
  }
  fetch (params = {}) {
    console.log('params:', params);
    let _data=[];
    let pagination;
    this.setState({ loading: true });
    reqwest({
      url: window.host+'/api/accounts/companies',
      method: 'get',
      crossOrigin: true,
      data: {
        access_token:localStorage['token'],
        page:params.page,
      },
      type: 'json',
    }).then((data) => {
    	console.log(data);
   	    // const pagination = { ...this.state.pagination };
      // Read total count from server
      // pagination.total = data.totalCount;
      if(params.page==1){
        pagination = data.total;
  	  }
      window.sessionStorage['apply']=JSON.stringify(data.select_list);
      // console.log(data.list[0].state)
		  	for(let i of data.list){
		  		_status=i.status=='通过'?<span style={{color:'#108ee9'}}>{i.state}</span>:<a>{i.state}</a>
	        _data.push({
	        	key:i.id,
	        	name:i.name,
	        	admin:i.admin_name,
	        	mobile:i.admin_mobile,
	        	status:_status
	        })
		    }
      this.setState({
        loading: false,
        data: _data,
        pagination,
      });
    });
  }
	componentWillMount(){
		this.fetch({page:1});
	}
	menuClick(e){
		console.log(e.item.props.value)
		this.setState({dropDown:e.item.props.value});
	}
	componentDidMount(){

	}
	render(){
		let compan=null;
		let col=this.state.columns;
		console.log(window.annount_type)
		if(window.localStorage['account_type']=='Account'){
		  compan=<Button ><Link to={{pathname:'/app/newan',query:{current:this.props.location.query.current}}}>新建品牌</Link></Button>
		}else if(window.localStorage['account_type']=='Dealer'){
		  compan=<Button ><Link to={{pathname:'/app/appan',query:{current:this.props.location.query.current}}}>关联品牌</Link></Button>;
		  col=this.state._columns;
		}else{
			compan=''
			col=this.state.delalet;
		}
		const { data,pagination,loading,dropDown,columns } = this.state;
		return(
			<Layout style={{background:'#fff',height:'100%'}}>
				<Content >
					<Row >
            <Col  sm={{span:7,offset:0}} xs={{span:9}} style={{padding:'24px 25px 24px'}}>
							品牌
						</Col>
            <Col xl={{span :3,offset:13}} lg={{span:3,offset:13}} md={{span:3,offset:13}} sm={{span:3,offset:13}} xs={{span:2,offset:8}} style={{lineHeight:'60px',textAlign:'right'}}>
              <Button ><Link to={{pathname:'/app/appan',query:{current:this.props.location.query.current}}}>关联品牌</Link></Button>
						</Col>
					</Row>
					<Layout className={`${style.tb_serbor}`}>
						<Row  className={`${style.tb_ser}`}>
							<Col sm={{span:7}} xs={{span:0}}>
							</Col>
              <Col sm={{span:7,offset:10}} xs={{span:14,offset:10}} style={{textAlign:'right'}}>
								
							</Col>
						</Row>
			      <Table columns={this.state._columns}
			        dataSource={data} onRowClick={this.handleRowClick}
			        pagination={pagination}
			        loading={loading}
			        onChange={this.handleTableChange.bind(this)}
			      />
		      </Layout>
				</Content>
			</Layout>	
		)
	}
}
// rowSelection={rowSelection} 批量删除

export default connect()(Company);